<template>
  <!-- 滚动顶部 -->
  <button class="fixed right-6 bottom-12 z-30 rounded-full p-3 bg-yellow hover:bg-yellow-light"
    @click.prevent="scrollToTop">
    <svg class="transform-gpu rotate-180" width="16px" height="16px" viewBox="0 0 16 16" version="1.1"
      xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
      <title>Icons/Chevron down</title>
      <g id="Symbols" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round"
        stroke-linejoin="round">
        <g id="Icons/Chevron-down" stroke="currentColor" stroke-width="1.71428571">
          <polyline id="Path" points="14 5 8 11 2 5"></polyline>
        </g>
      </g>
    </svg>
  </button>
</template>
<script lang="ts">
import { defineComponent } from 'vue'
export default defineComponent({
  setup() {
    const scrollToTop = () => {
      const sTop = document.documentElement.scrollTop || document.body.scrollTop
      if (sTop > 0) {
        window.scrollTo({ left: 0, top: 0 })
      }
    }
    return { scrollToTop }
  }
})
</script> 
